require("./mine_information.less");
let axios = require("axios");

window.addEventListener("DOMContentLoaded", function () {
	axios.defaults.baseURL = "http://fitness.h5.itsource.cn:3701";
	let token = localStorage.getItem("token");
	axios.defaults.headers.common["Authorization"] = "Bearer " + token;
	// 获取工具
	function $(v) {
		return document.querySelector(v);
	}
	// 返回按钮
	$("#back").addEventListener("click", function () {
		history.back();
	});
	// 设置头像
	let imgurl = "";
	$("#head_pohoto").addEventListener("change", function () {
		// 使用FormData()的方法上传数据
		let fd = new FormData();
		fd.append("file", this.files[0]);
		axios.post("/api/shared/uploadPortrait", fd).then((v) => {
			console.log(11);
			if (v.data.errno === 0) {
				$(
					"#photo"
				).src = `http://fitness.h5.itsource.cn:3701${v.data.data.url}`;

				imgurl = `http://fitness.h5.itsource.cn:3701${v.data.data.url}`;
			} else {
				alert("上传失败");
			}
		});
	});
	// 性别下拉框
	let gendernum = 0;
	$("#gender").addEventListener("click", function () {
		weui.picker(
			[
				{
					label: "男",
					value: 0,
				},
				{
					label: "女",
					value: 1,
				},
				{
					label: "娚",
					value: 2,
				},
			],
			{
				onConfirm: function (result) {
					$("#gender").textContent = result[0].label;
					gendernum = result[0].value;
				},
				title: "性别",
			}
		);
	});
	// 生日
	let theday = "";
	$("#birthday").addEventListener("click", function () {
		weui.datePicker({
			start: 1990,
			end: new Date().getFullYear(),
			onConfirm: function (result) {
				// 渲染
				$("#birthday").textContent = result.map((v) => v.value).join("-");
				theday = result.map((v) => v.value).join("-");
			},
			title: "出生日期",
		});
	});
	// 省市二级联动
	// 省份
	let provincenum = 0;
	$("#province").addEventListener("click", function () {
		axios
			.get("http://fitness.h5.itsource.cn:3701/api/shared/province")
			.then((v) => {
				let provincearr = v.data.data.map((v) => {
					return { label: v.name, value: v.id };
				});
				weui.picker(provincearr, {
					onConfirm: function (result) {
						$("#province").textContent = result[0].label;
						provincenum = result[0].value;
					},
					title: "选择省份",
				});
			});
	});
	// 城市
	let citynum = 0;
	$("#city").addEventListener("click", function () {
		axios.get("/api/shared/city?provinceId=" + provincenum).then((v) => {
			let cityarr = v.data.data.map((v) => {
				return { label: v.name, value: v.id };
			});
			weui.picker(cityarr, {
				onConfirm: function (result) {
					$("#city").textContent = result[0].label;
					citynum = result[0].value;
				},
				title: "选择城市",
			});
		});
	});
	// 个性签名
	$("#sign").addEventListener("input", function () {
		$("#num").textContent = this.value.length;
	});

	// 保存数据
	$("#submit").addEventListener("click", function () {
		let nickName = $("#username").value;
		let gender = gendernum;
		let provinceId = provincenum;
		let cityId = citynum;
		let birthday = theday;
		let imgUrl = imgurl;
		let sign = $("#sign").value;
		axios
			.post("/api/user/changeInfo", {
				nickName,
				gender,
				provinceId,
				cityId,
				birthday,
				imgUrl,
				sign,
			})
			.then((v) => {
				console.log(v);
				if (v.data.data.errno === 0) {
					alert("修改成功");
					localStorage.setItem("token", v.data.data.token);
					// history.back();
				} else {
					// alert("修改失败");
				}
			});
	});
	axios.get("/api/user/info").then((v) => {
		let data = v.data.data;
		console.log(data);
		// 头像回填
		$("#photo").src = axios.defaults.baseURL + data.imgUrl;
		imgurl = data.imgUrl;
		// 昵称
		$("#username").textContent = data.nickName;
		// 性别
		let arr = ["男", "女", "娚"];
		gendernum = data.gender;
		$("#gender").textContent = arr[gendernum];
		// 生日
		$("#birthday").textContent = data.birthday;
		theday = data.birthday;
		// 省份
		axios.get("api/shared/province").then((v) => {
			let [provinceN] = v.data.data.filter((i) => i.id === data.provinceId);
			$("#province").textContent = provinceN;
			provincenum = provinceN.id;
		});

		// 城市
		axios.get("/api/shared/city?provinceId=" + data.provinceId).then((v) => {
			let [cityN] = v.data.data.filter((i) => {
				return i.id === data.cityId;
			});
			console.log(cityN);
			$("#city").textContent = cityN.name;
			citynum = cityN.id;
		});
		// 签名
		$("#sign").textContent = data.sign;
		$("#num").textContent = $("#sign").value.length;
	});
});
